<template>
  <a-config-provider :locale="locale">
    <div id="app">
      <router-view/>
    </div>
  </a-config-provider>
</template>

<script>
  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN';
  export default {
    data() {
      return {
        locale: zhCN,
      };
    },
  };
</script>

<style lang="scss">
* {
  padding: 0;
  margin: 0;

  font-family: 'Noto Sans SC', sans-serif;;
}



body, html {
  margin: 0;
}

#app {
  height: 100%;
  .ant-calendar-range .ant-calendar-in-range-cell:before  {
    color: #9dddff;
  }
}

td, span, label, input, div:not(.ant-card-body), li {
  color: #333333;
}

.ant-btn-primary span, .ant-btn-danger span {
  color: #eeeeee;
}

.alert {
  margin-bottom: 10px !important;
}

.yellow-btn {
  background-color: rgb(189, 186, 0) !important;
  border-color: rgba(189, 186, 0, 0.5) !important;
  span {
    color: white !important;
  }
  transition: .25s ease-in-out;

  &:disabled {
    color: rgb(212, 212, 212) !important;
    background-color: rgba(189, 186, 0, 0.5) !important;
  }

  &:hover {
    background-color: rgba(189, 186, 0, 0.7) !important;
    border-color: rgba(189, 186, 0, 0.3) !important;
  }
}

.green-btn {
  background-color: rgb(0, 189, 132) !important;
  border-color: rgba(0, 189, 132, 0.5) !important;
  span, i {
    color: white !important;
  }

  &:disabled {
    color: rgb(212, 212, 212) !important;
    background-color: rgba(0, 189, 132, 0.5) !important;
  }

  &:hover {
    background-color: rgb(0, 189, 132, 0.7) !important;
    border-color: rgba(0, 189, 132, 0.3) !important;
  }
}

.light-green-btn {
  background-color:hsl(120, 100%, 60%) !important;
  border-color: hsla(120, 100%, 60%, 0.5) !important;
  span, i {
    color: white !important;
  }

  &:disabled {
    color: rgb(212, 212, 212) !important;
    background-color: hsla(120, 100%, 60%, 0.5) !important;
  }

  &:hover {
    background-color: hsla(120, 100%, 60%, 0.7) !important;
    border-color: hsla(120, 100%, 60%, 0.3) !important;
  }
}

.orange-btn {
  background-color: hsl(30, 100%, 50%) !important;
  border-color: hsla(30, 100%, 50%, 0.5) !important;
  span, i {
    color: white !important;
  }

  &:disabled {
    color: rgb(212, 212, 212) !important;
    background-color: hsla(30, 100%, 50%, 0.5) !important;
  }

  &:hover {
    background-color: hsla(30, 100%, 50%, 0.7) !important;
    border-color: hsla(30, 100%, 50%, 0.3) !important;
  }
}

.ant-table-tbody>tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)>td {
  background: #b3d1fd;
}


</style>
